import { ImageLayer, MouseLocation, PointLayer } from '@antv/l7';
import type { TestCase } from '../../types';
import { CaseScene } from '../../utils';
export const simpleMap: TestCase = async (options) => {
  const scene = await CaseScene({
    ...options,
    mapConfig: {
      center: [500, 500],
      zoom: 3,
      version: 'SIMPLE',
      mapSize: 1000,
      pitchEnabled: false,
      rotateEnabled: false,
    },
  });
  scene.setBgColor('rgb(94, 182, 140)');

  const imagelayer = new ImageLayer({}).source(
    'https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*I0X5R4jAUQ4AAAAAAAAAAAAAARQnAQ',
    {
      parser: {
        type: 'image',
        extent: [360, 400, 640, 600],
      },
    },
  );

  fetch('https://gw.alipayobjects.com/os/bmw-prod/7dc0d454-fabc-4461-a5d5-d404dadb49a9.json')
    .then((res) => res.json())
    .then((data) => {
      const textlayer = new PointLayer({ zIndex: 2 })
        .source(data, {
          parser: {
            type: 'json',
            x: 'x',
            y: 'y',
          },
        })
        .shape('t', 'text')
        .size(12)
        .active({
          color: '#00f',
          mix: 0.9,
        })
        .color('rgb(86, 156, 214)')
        .style({
          textAnchor: 'center', // 文本相对锚点的位置 center|left|right|top|bottom|top-left
          spacing: 2, // 字符间距
          fontWeight: '800',
          padding: [1, 1], // 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
          stroke: '#ffffff', // 描边颜色
          strokeWidth: 2, // 描边宽度
          textAllowOverlap: true,
        });
      scene.addLayer(textlayer);
    });

  scene.addLayer(imagelayer);
  const mouseLocation = new MouseLocation({
    position: 'bottomright',
  });
  scene.addControl(mouseLocation);
  scene.on('click', (e) => {
    console.log(e.lngLat);
  });
  return scene;
};
